<template>
  <div class="data">
    <button @click="btnClick">弹出提示框</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      superList: [
        {
          houseno: 1,
          cate1id: 11,
          cate2id: 12
        },
        {
          houseno: 1,
          cate1id: 111,
          cate2id: 121
        },
        {
          houseno: 2,
          cate1id: 1111,
          cate2id: 1211
        }
      ],
      newSuperList: []
    }
  },
  created() {
    // this.setData()
    this.getAsyncRoutes()
  },
  methods: {
    btnClick() {
      this.$toast.show('看到了吗！', 3000)
    },

    setData() {
      console.log('数据转换之前::', this.superList)
      let housenoList = []

      this.superList.forEach(item => {
        let flag = false

        if (housenoList.includes(item.houseno)) {
          flag = true
        }

        if (!flag) {
          let obj = {}
          obj.houseno = item.houseno
          let cateList = []
          this.superList.forEach(item1 => {
            let obj1 = {}
            if (item1.houseno == item.houseno) {
              obj1.cate1id = item1.cate1id
              obj1.cate2id = item1.cate2id
              cateList.push(obj1)
            }
          })
          obj.children = cateList
          newSuperList.push(obj)
          housenoList.push(item.houseno)
        }
      })

      console.log('数据转换之后::', newSuperList)

      // superList.forEach(item => {
      //   let houseno = item.houseno
      //   let flag = false
      //   for (var i = 0; i < housenoList.length; i++) {
      //     if (housenoList[i] == houseno) {
      //       flag = true
      //       break
      //     }
      //   }
      //   if (!flag) {
      //     let obj = {}
      //     obj.houseno = houseno
      //     let cateList = []
      //     superList.forEach(item1 => {
      //       let obj2 = {}
      //       if (item1.houseno == houseno) {
      //         obj2.cate1id = item1.cate1id
      //         obj2.cate2id = item1.cate2id
      //         cateList.push(obj2)
      //       }
      //     })
      //     obj.children = cateList
      //     newSuperList.push(obj)
      //     housenoList.push(houseno)
      //   }
      // })
    },

    // 接受后端接口 返回的路由数据 构建成 前端路由表
    generateMenu(routes, serviceMap) {
      // 前端组件映射map
      const map = {
        home: () => import('./Home.vue'), // 同步的方式
        map: () => import('./map.vue')
      }
      // 遍历构造生成路由表
      serviceMap.forEach(item => {
        const menu = {
          path: item.path,
          component: item.component === 'Layout' ? Layout : map[item.component],
          //   component: item.component === 'Layout' ? Layout : () => import(`@${item.component}`),
          hidden: item.hidden,
          name: item.name,
          redirect: item.redirect ? item.redirect : '',
          children: [],
          meta: { title: item.title, icon: item.icon }
        }
        if (item.children && item.children.length > 0) {
          this.generateMenu(menu.children, item.children)
        } else {
          delete menu.children
        }
        routes.push(menu)
      })
    },

    // 构造前端路由
    getAsyncRoutes() {
      // 后端返回的路由数据
      const serviceMap = [
        {
          path: '/login',
          component: 'home',
          name: 'login',
          hidden: true,
          title: '首页',
          icon: 'icon-yx_danganguanli',
          children: [
            {
              path: 'page',
              component: 'map',
              hidden: false,
              name: 'PagePermission',
              title: '地图',
              icon: ''
            }
          ]
        }
      ]
      let accessedRoutes = []
      this.generateMenu(accessedRoutes, serviceMap)
      console.log('构造后的前端路由表::', accessedRoutes)
    }
  }
}
</script>

<style lang="less" scoped></style>
